@import '../../../assets/css/CommonStyle.scss';
#Patient-PatientPhone {
  padding: m-w(30);
  display: flex;
  flex-direction: column;
  .ant-form-explain {
    text-align: right;
  }
  .closeIcon {
    color: #333;
  }
  .patientTitle {
    display: flex;
    font-size: m-w(46);
    font-weight: 600;
    color: rgba(51, 51, 51, 1);
    margin-bottom: m-h(95);
  }
  .containerInput {
    position: relative;
    .labelInput {
      color: #429cff;
      font-size: m-w(22);
      position: absolute;
      left: 0;
      top: 0;
      z-index: 0;
      opacity: 0;
      transition: top 1s, z-index 1s, opacity 1s;
    }
    .showLabel {
      top: m-h(-90);
      z-index: 1;
      opacity: 1;
    }
    input {
      padding-left: 0;
      padding-right: 0;
      font-size: m-w(34);
    }
  }
  .ant-form-item {
    margin: 0;
  }
  .ant-input {
    border: none;
    border-radius: 0;
    border-bottom: 1px solid rgba(51, 51, 51, 0.1);
  }
  .ant-input:focus {
    box-shadow: none;
    -webkit-box-shadow: none;
  }

  .codeContiner {
    margin-top: m-w(75);
    display: flex;
    align-items: center;
    .codeInput {
      flex: 1;
    }
    .action {
      margin-left: m-w(50);
      background: #fff;
      border-radius: m-w(8);
      border: 1px solid rgba(66, 156, 255, 1);
      color: #429cff;
      padding: m-w(10) m-w(25);
    }
    .enable {
      background: #c7e1ff;
      border-color: #c7e1ff;
      color: #8dc3ff;
    }
  }

  .ant-form {
    margin-bottom: m-w(120);
  }
  .inputFrom {
    margin-bottom: m-w(40);
  }
  .inputBottom {
    border-bottom: 1px solid #e8e8e8;
    margin-bottom: m-w(16);
    position: relative;
  }
  .labelInput {
    position: absolute;
    top: m-h(140);
    left: 0;
    font-size: m-w(22);
    color: #429cff;
    z-index: 0;
    opacity: 0;
    transition: top 1s, z-index 1s, opacity 1s;
  }
  .code {
    top: 0;
  }
  .showLabel {
    top: m-h(70);
    z-index: 1;
    opacity: 1;
  }
  .showCode {
    top: m-h(-110);
  }
  .inputBox {
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding-left: 0;
    font-size: m-w(34);
  }
  .phone {
    margin-top: m-w(90);
  }
  .verifyCode {
    width: m-w(440);
  }
  .codeEnable {
    background: #d9ebff !important;
    border-color: #d9ebff !important;
    color: #73b2f7 !important;
  }
  .sendVerification {
    padding: 0 m-w(10);
    width: m-w(200);
    height: m-w(72);
    line-height: m-w(72);
    background: #fff;
    border: 1px solid #429cff;
    color: #429cff;
    font-size: m-w(30);
  }
  .enable {
    background: #c7e1ff;
    border-color: #c7e1ff;
    color: #fff;
  }
  .backPatient {
    color: #429cff;
    font-size: m-w(30);
    font-weight: 400;
    display: block;
    margin-bottom: m-w(24);
    margin-top: m-w(143);
  }

  .sure {
    width: m-w(690);
    height: m-w(80);
    line-height: m-w(80);
    background: #429cff;
    color: #fff;
    border: none;
    box-shadow: none;
    font-size: m-w(34);
  }
  .sure:disabled {
    opacity: 0.6;
  }
}
